<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="应用场景编号" prop="sceneId" label-width="100px">
        <el-input
          v-model="queryParams.sceneId"
          placeholder="请输入应用场景编号"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="名称" prop="name">
        <el-input
          v-model="queryParams.name"
          placeholder="请输入名称"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <!--      <el-form-item label="运行环境(python、drools、groovy.)" prop="runEnv">-->
      <!--        <el-input-->
      <!--          v-model="queryParams.runEnv"-->
      <!--          placeholder="请输入运行环境(python、drools、groovy.)"-->
      <!--          clearable-->
      <!--          size="small"-->
      <!--          @keyup.enter.native="handleQuery"-->
      <!--        />-->
      <!--      </el-form-item>-->
      <!--      <el-form-item label="校验通过状态(1:通过0:不通过)" prop="state">-->
      <!--        <el-input-->
      <!--          v-model="queryParams.state"-->
      <!--          placeholder="请输入校验通过状态(1:通过0:不通过)"-->
      <!--          clearable-->
      <!--          size="small"-->
      <!--          @keyup.enter.native="handleQuery"-->
      <!--        />-->
      <!--      </el-form-item>-->
      <!--      <el-form-item label="插入时间" prop="insertTime">-->
      <!--        <el-date-picker clearable size="small"-->
      <!--          v-model="queryParams.insertTime"-->
      <!--          type="date"-->
      <!--          value-format="yyyy-MM-dd"-->
      <!--          placeholder="选择插入时间">-->
      <!--        </el-date-picker>-->
      <!--      </el-form-item>-->
      <el-form-item label="用户编号" prop="userId">
        <el-input
          v-model="queryParams.userId"
          placeholder="请输入用户编号"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>

      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
        >新增
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
        >修改
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
        >删除
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
        >导出
        </el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="ruleList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center"/>
      <el-table-column label="规则编号" align="center" prop="id"/>
      <el-table-column label="应用场景编号" align="center" prop="sceneId"/>
      <el-table-column label="名称" align="center" prop="name"/>
<!--      <el-table-column label="脚本类型" align="center">-->
<!--        <template v-if="scope.row.scriptType !== undefined && scope.row.scriptType !== null" slot-scope="scope">-->
<!--          <span>{{scriptTypeList[scope.row.scriptType]}}</span>-->
<!--        </template>-->
<!--      </el-table-column>-->
      <!--      <el-table-column label="运行环境" align="center" prop="runEnv"/>-->
      <!--      <el-table-column label="运行脚本" align="center" prop="runScript" />-->
      <el-table-column label="校验通过状态" align="center">
        <template v-if="scope.row.state !== undefined" slot-scope="scope">
          <span>{{scope.row.state === 1 ? '通过' : '不通过'}}</span>
        </template>
      </el-table-column>
      <!--      <el-table-column label="插入时间" align="center" prop="insertTime" width="180">-->
      <!--        <template slot-scope="scope">-->
      <!--          <span>{{ parseTime(scope.row.insertTime, '{y}-{m}-{d}') }}</span>-->
      <!--        </template>-->
      <!--      </el-table-column>-->
      <el-table-column label="用户编号" align="center" prop="userId"/>
      <!--      <el-table-column label="序号" align="center" prop="priority" />-->
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="execute(scope.row)"
          >执行脚本
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
          >修改
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
          >删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改规则信息对话框 -->
    <el-dialog :close-on-click-modal="false" :title="title" :visible.sync="open" v-if="open" width="1200px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="应用场景编号" prop="sceneId">
          <el-input v-model="form.sceneId" placeholder="请输入应用场景编号（输入完按回车键，加载输入参数）"
                    @keyup.enter.native="getParamListBySceneId(form.sceneId)"/>
        </el-form-item>
        <el-form-item label="名称" prop="name">
          <el-input v-model="form.name" placeholder="请输入名称"/>
        </el-form-item>

        <el-form-item label="输入参数" prop="inputParameter">
          <el-input v-model="form.inputParameter" disabled/>
        </el-form-item>
        <el-form-item label="输出参数" prop="outputParameter">
          <el-input v-model="form.outputParameter" disabled/>
        </el-form-item>

        <div v-for="(item, index) in scriptList">

          <!--其他脚本类型--修改-->
          <div :class="{'jsbox':item.state === 1, 'jsbox_off': item.state === 0}" v-if="item.scriptType !== 2">

            <el-row  class="jsbox_titles">
              <el-col :span="3">
                <el-form-item label="脚本" :prop="'priority' + index">
                  <el-input v-model="item.priority" type="number" placeholder="请输入内容"/>
                </el-form-item>
              </el-col>
              <el-col :span="13">
                <el-form-item class="title_form" label="" :prop="'scriptType' + index">
                  <i :class="{'el-icon-s-flag myflog1':item.scriptType === 0, 'el-icon-s-flag myflog2': item.scriptType === 1, 'el-icon-s-flag myflog3': item.scriptType === 2, 'el-icon-s-flag myflog4': item.scriptType === 3, 'el-icon-s-flag myflog5': item.scriptType === 4}"></i> <span class="myname_color">脚本类型：</span>
                <el-select v-model="item.scriptType" placeholder="请选择类型"  size="small">
                  <el-option v-for="(typeItem, typeIndex) in scriptTypeList" :label="typeItem" :value="typeIndex" />
              </el-select>
                </el-form-item>

              </el-col>
              <el-col :span="8" style="text-align: right;">
                <el-switch
                  v-model="item.state"
                  :active-value="1"
                  :inactive-value="0"
                  :inactive-text="item.state === 1 ? '已启用' : (item.state === 0 ? '未启用' : '')"
                  >
                </el-switch>
                <el-button size="mini" v-if="index > 0" @click="scriptUpward(index)" type="primary" style="margin-bottom: 20px;margin-top: 10px;" icon="el-icon-top">上移</el-button>
                <el-button size="mini" v-if="index !== scriptList.length - 1" @click="scriptDownward(index)" type="primary" style="margin-bottom: 20px;margin-top: 10px;" icon="el-icon-bottom">下移</el-button>
                <el-button size="mini" @click="deleteScript(index)" type="danger" style="margin-bottom: 20px;margin-top: 10px;" icon="el-icon-delete-solid">删除</el-button>
              </el-col>
            </el-row>

            <div class="boxborder1">


            <!-- <el-form-item label="脚本序号" :prop="'priority' + index">
              <el-input v-model="item.priority" type="number" placeholder="请输入内容"/>
            </el-form-item> -->
            <!--类型信息-->
            <!-- <el-form-item label="脚本类型" :prop="'scriptType' + index">
              <el-select v-model="item.scriptType" placeholder="请选择类型" clearable size="small">
                <el-option v-for="(typeItem, typeIndex) in scriptTypeList" :label="typeItem" :value="typeIndex" />
              </el-select>
            </el-form-item> -->
            <div style="padding:0 15px 15px 15px;">
            <!--脚本内容-->
            <el-form-item label="运行脚本" :prop="'runScript' + index">
              <el-input v-model="item.runScript" :rows="2" type="textarea" placeholder="请输入内容"/>
            </el-form-item>
          </div>
          </div>

          </div>

          <!--条件脚本类型--修改-->
          <div :class="{'jsbox':item.state === 1, 'jsbox_off': item.state === 0}"  v-else>

            <el-row  class="jsbox_titles">
              <el-col :span="3">
                <el-form-item label="脚本" :prop="'priority' + index">
                  <el-input v-model="item.priority"  type="number" placeholder="请输入内容"/>
                </el-form-item>
              </el-col>
              <el-col :span="13">
                <el-form-item class="title_form" label="" :prop="'scriptType' + index">
                  <i :class="{'el-icon-s-flag myflog1':item.scriptType === 0, 'el-icon-s-flag myflog2': item.scriptType === 1, 'el-icon-s-flag myflog3': item.scriptType === 2, 'el-icon-s-flag myflog4': item.scriptType === 3, 'el-icon-s-flag myflog5': item.scriptType === 4}"></i> <span class="myname_color">脚本类型：</span>
                <el-select v-model="item.scriptType" placeholder="请选择类型"  size="small">
                  <el-option v-for="(typeItem, typeIndex) in scriptTypeList" :label="typeItem" :value="typeIndex" />
              </el-select>
                </el-form-item>

              </el-col>
              <el-col :span="8" style="text-align: right;">
                <el-switch
                  v-model="item.state"
                  :active-value="1"
                  :inactive-value="0"
                  :inactive-text="item.state === 1 ? '已启用' : (item.state === 0 ? '未启用' : '')"
                  >
                </el-switch>
                <el-button size="mini" v-if="index > 0" @click="scriptUpward(index)" type="primary" style="margin-bottom: 20px;margin-top: 10px;" icon="el-icon-top">上移</el-button>
                <el-button size="mini" v-if="index !== scriptList.length - 1" @click="scriptDownward(index)" type="primary" style="margin-bottom: 20px;margin-top: 10px;" icon="el-icon-bottom">下移</el-button>
                <el-button size="mini" @click="deleteScript(index)" type="danger" style="margin-bottom: 20px;margin-top: 10px; " icon="el-icon-delete-solid">删除</el-button>
              </el-col>
            </el-row>

            <div class="boxborder1">




            <!-- <el-form-item label="脚本序号b" :prop="'priority' + index">
              <el-input v-model="item.priority"  type="number" placeholder="请输入内容"/>
            </el-form-item> -->
            <!--类型信息-->
            <!-- <el-form-item label="脚本类型" :prop="'scriptType' + index">
              <el-select v-model="item.scriptType" placeholder="请选择类型" clearable size="small">
                <el-option v-for="(typeItem, typeIndex) in scriptTypeList" :label="typeItem" :value="typeIndex" />
              </el-select>
            </el-form-item> -->

            <div style="padding:15px;" v-for="(conditionItem, conditionIndex) in item.conditionList">

              <div class="condition_title">
                  <el-row  class="">
                    <el-col :span="3">
                      <span class="condition_title_text">条件：{{conditionIndex+1}}</span>
                    </el-col>
                    <el-col :span="9">
                      <!--条件类型信息-->
                      <el-form-item label="条件类型" :prop="'conditionType' + index + '' + conditionIndex">
                        <el-select v-model="conditionItem.conditionType" placeholder="请选择类型" clearable size="small">
                          <el-option v-for="(conditionTypeItem, conditionTypeIndex) in conditionTypeList" :label="conditionTypeItem" :value="conditionTypeIndex" />
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12" style="text-align: right;">
                      <el-button size="mini" icon="el-icon-top" v-if="conditionIndex > 0" @click="conditionUpward(conditionIndex, item.conditionList)" type="warning" style="margin-bottom: 20px;margin-top: 10px;">上移</el-button>
                      <el-button size="mini" icon="el-icon-bottom" v-if="conditionIndex !== item.conditionList.length - 1" @click="conditionDownward(conditionIndex, item.conditionList)" type="warning" style="margin-bottom: 20px;margin-top: 10px;">下移</el-button>
                      <el-button size="mini" icon="el-icon-close" v-if="item.conditionList.length > 1" @click="deleteCondition(item.conditionList, conditionIndex)" type="danger" style="margin-bottom: 20px;">删除</el-button>
                    </el-col>
                  </el-row>

                </div>

              <!-- <el-form-item label="条件序号" :prop="'priority' + index + '' + conditionIndex">
                <el-input v-model="conditionItem.priority"  type="number" placeholder="请输入内容"/>
              </el-form-item> -->



              <el-row :gutter="10">
                  <el-col style="width: 49%;"  v-if="conditionItem.conditionType !== 2">
                    <div>条件脚本</div>
                    <el-form-item class="mybox_s1" label="" :prop="'runScript' + index + '' + conditionIndex">
                  <el-input v-model="conditionItem.conditionScript" :rows="3" type="textarea" placeholder="请输入内容"/>
                </el-form-item>
                  </el-col>

                  <el-col style="width: 2%;"   v-if="conditionItem.conditionType !== 2">
                    <i class="el-icon-d-arrow-right" style="margin: 60px auto 0 0px;"></i>
                  </el-col>


                  <el-col style="width: 49%;" v-if="conditionItem.conditionType !== 2">
                    <div>执行脚本</div>
                    <el-form-item  class="mybox_s2"  label="" :prop="'executeScript' + index + '' + conditionIndex">
                  <el-input v-model="conditionItem.execute" :rows="3" type="textarea" placeholder="请输入内容"/>
                </el-form-item>
                  </el-col>

                  <el-col style="width: 100%;" v-if="conditionItem.conditionType == 2">
                    <div>执行脚本</div>
                    <el-form-item  class="mybox_s2"  label="" :prop="'executeScript' + index + '' + conditionIndex">
                  <el-input v-model="conditionItem.execute" :rows="3" type="textarea" placeholder="请输入内容"/>
                </el-form-item>
                  </el-col>

                </el-row>



              <!--脚本信息-->
              <!-- <el-form-item v-if="conditionItem.conditionType !== 2" label="条件脚本" :prop="'runScript' + index + '' + conditionIndex">
                <el-input v-model="conditionItem.conditionScript" :rows="1" type="textarea" placeholder="请输入内容"/>
              </el-form-item>

              <el-form-item  label="执行脚本" :prop="'executeScript' + index + '' + conditionIndex">
                <el-input v-model="conditionItem.execute" :rows="3" type="textarea" placeholder="请输入内容"/>
              </el-form-item> -->


              <!-- <el-button v-if="item.conditionList.length > 1" @click="deleteCondition(item.conditionList, conditionIndex)" type="warning" style="margin-bottom: 20px;">删除条件</el-button> -->
            </div>

            <div style="text-align: right;  margin-right: 20px"><el-button style="margin-bottom: 0px" type="primary" @click="addCondition(item.conditionList)">添加条件</el-button></div>

          </div>
          </div>

          <!-- <el-button @click="deleteScript(index)" type="danger" style="margin-bottom: 20px;margin-top: 10px;">删除脚本</el-button> -->
        </div>

        <div style="text-align: right;"><el-button v-if="this.form.id != null" type="primary" @click="addScript">添加脚本</el-button></div>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 执行脚本弹窗 -->
    <el-dialog :close-on-click-modal="false" title="执行脚本" :visible.sync="openExecute" v-if="openExecute" width="1200px" append-to-body>



      <el-form ref="scriptForm" :model="scriptForm" :rules="scriptRules" label-width="80px">

        <el-form-item label="运行脚本" prop="scriptName">
          <el-input v-model="scriptForm.scriptName" disabled/>
        </el-form-item>

        <el-form-item label="输入参数" prop="inputParameter">
          <el-input v-model="scriptForm.inputParameter" disabled/>
        </el-form-item>
        <el-form-item label="输入变量" prop="variable" v-if="scriptForm.inputParameter">
          <el-input v-model="scriptForm.variable" placeholder="请输入参数,格式：参数1、参数2"/>
        </el-form-item>
        <el-form-item label="输出参数" prop="outputParameter">
          <el-input v-model="scriptForm.outputParameter" disabled/>
        </el-form-item>
        <el-form-item label="说明" prop="illustrate">
          <el-input v-model="scriptForm.illustrate" :rows="3" type="textarea" disabled/>
        </el-form-item>


        <div v-for="(item, index) in scriptList">

          <!--其他脚本类型-->
          <div :class="{'jsbox':item.state === 1, 'jsbox_off': item.state === 0}"  v-if="item.scriptType !== 2">
            <el-row  class="jsbox_titles">
              <el-col :span="3">
                <el-form-item label="脚本" :prop="'priority' + index">
                <el-input v-model="item.priority"  type="number" placeholder="请输入内容"/>
                </el-form-item>
              </el-col>
              <el-col :span="10">
                <el-form-item class="title_form" label="" :prop="'scriptType' + index">
                  <i :class="{'el-icon-s-flag myflog1':item.scriptType === 0, 'el-icon-s-flag myflog2': item.scriptType === 1, 'el-icon-s-flag myflog3': item.scriptType === 2, 'el-icon-s-flag myflog4': item.scriptType === 3, 'el-icon-s-flag myflog5': item.scriptType === 4}"></i> <span class="myname_color">脚本类型：</span>
                <el-select v-model="item.scriptType" placeholder="请选择类型"  size="small">
                  <el-option v-for="(typeItem, typeIndex) in scriptTypeList" :label="typeItem" :value="typeIndex" />
              </el-select>
                </el-form-item>

              </el-col>
              <el-col :span="11" style="text-align: right;">

                <el-switch
                  v-model="item.state"
                  :active-value="1"
                  :inactive-value="0"
                  :inactive-text="item.state === 1 ? '已启用' : (item.state === 0 ? '未启用' : '')"
                  >
                </el-switch>
                <el-button size="mini" v-if="index > 0" @click="scriptUpward(index)" type="primary" style="margin-bottom: 20px;margin-top: 5px!important;" icon="el-icon-top">上移</el-button>
                <el-button size="mini" v-if="index !== scriptList.length - 1" @click="scriptDownward(index)" type="primary" style="margin-bottom: 20px;margin-top: 10px;" icon="el-icon-bottom">下移</el-button>
                <el-button size="mini" @click="deleteScript(index)" type="danger" style="margin-bottom: 20px;margin-top: 5px!important;" icon="el-icon-delete-solid">删除</el-button>
              </el-col>
            </el-row>

            <div class="boxborder1">

            <!-- <el-form-item label="脚本序号c" :prop="'priority' + index">
              <el-input v-model="item.priority" type="number" placeholder="请输入内容"/>
            </el-form-item> -->

            <!--类型信息-->
            <!-- <el-form-item label="脚本类型" :prop="'scriptType' + index">
              <el-select v-model="item.scriptType" placeholder="请选择类型" clearable size="small">
                <el-option v-for="(typeItem, typeIndex) in scriptTypeList" :label="typeItem" :value="typeIndex" />
              </el-select>
            </el-form-item> -->
            <!--脚本内容-->
            <div  style=" padding:0 15px 0px 15px;">
              <el-form-item label="运行脚本" :prop="'runScript' + index">
                <el-input v-model="item.runScript" :rows="2" type="textarea" placeholder="请输入内容"/>
              </el-form-item>
            </div>

          </div>
        </div>

          <!--条件脚本类型-->
          <div :class="{'jsbox':item.state === 1, 'jsbox_off': item.state === 0}"  v-else>

            <el-row  class="jsbox_titles">
              <el-col :span="3">
              <el-form-item label="脚本" :prop="'priority' + index">
              <el-input v-model="item.priority"  type="number" placeholder="请输入内容"/>
              </el-form-item>
              </el-col>
              <el-col :span="10">
                <div id="mycolor">
                <el-form-item class="title_form" label="" :prop="'scriptType' + index">
                  <i :class="{'el-icon-s-flag myflog1':item.scriptType === 0, 'el-icon-s-flag myflog2': item.scriptType === 1, 'el-icon-s-flag myflog3': item.scriptType === 2, 'el-icon-s-flag myflog4': item.scriptType === 3, 'el-icon-s-flag myflog5': item.scriptType === 4}"></i> <span class="myname_color">脚本类型：</span>
                <el-select v-model="item.scriptType" placeholder="请选择类型"  size="small">
                  <el-option v-for="(typeItem, typeIndex) in scriptTypeList" :label="typeItem" :value="typeIndex" />
                </el-select>
                </el-form-item>
              </div>
              </el-col>
              <el-col :span="11" style="text-align: right;">
                <el-switch
                  v-model="item.state"
                  :active-value="1"
                  :inactive-value="0"
                  :inactive-text="item.state === 1 ? '已启用' : (item.state === 0 ? '未启用' : '')"
                  >
                </el-switch>

                <el-button size="mini" v-if="index > 0" @click="scriptUpward(index)" type="primary" style="margin-bottom: 20px;margin-top: 5px!important;" icon="el-icon-top">上移</el-button>
                <el-button size="mini" v-if="index !== scriptList.length - 1" @click="scriptDownward(index)" type="primary" style="margin-bottom: 20px;margin-top: 10px;" icon="el-icon-bottom">下移</el-button>
                <el-button size="mini" @click="deleteScript(index)" type="danger" style="margin-bottom: 20px;margin-top: 5px!important;" icon="el-icon-delete-solid">删除</el-button>
              </el-col>
            </el-row>

            <div class="boxborder1">
            <div style=" padding:0 15px 15px 15px;">
              <!--类型信息-->


              <div v-for="(conditionItem, conditionIndex) in item.conditionList">
                <div class="condition_title">
                  <el-row  class="">
                    <el-col :span="3">
                      <span class="condition_title_text">条件：{{conditionIndex+1}}</span>
                    </el-col>
                    <el-col :span="9">
                       <!--条件类型信息-->
                      <el-form-item label="条件类型" :prop="'conditionType' + index + '' + conditionIndex">
                        <el-select v-model="conditionItem.conditionType" placeholder="请选择类型" clearable size="small">
                          <el-option v-for="(conditionTypeItem, conditionTypeIndex) in conditionTypeList" :label="conditionTypeItem" :value="conditionTypeIndex" />
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12" style="text-align: right;">
                      <el-button size="mini" icon="el-icon-top" v-if="conditionIndex > 0" @click="conditionUpward(conditionIndex, item.conditionList)" type="warning" style="margin-bottom: 20px;margin-top: 10px;">上移</el-button>
                      <el-button size="mini" icon="el-icon-bottom" v-if="conditionIndex !== item.conditionList.length - 1" @click="conditionDownward(conditionIndex, item.conditionList)" type="warning" style="margin-bottom: 20px;margin-top: 10px;">下移</el-button>
                      <el-button size="mini" icon="el-icon-close" v-if="item.conditionList.length > 1" @click="deleteCondition(item.conditionList, conditionIndex)" type="danger" style="margin-bottom: 20px;">删除</el-button>
                    </el-col>
                  </el-row>

                </div>
                  <!-- <el-form-item label="条件" :prop="'priority' + index + '' + conditionIndex">
                  <el-input v-model="conditionItem.priority"  type="number" placeholder="请输入内容"/>
                  </el-form-item> -->



                <!--条件类型信息-->
                <!-- <el-form-item label="条件类型" :prop="'conditionType' + index + '' + conditionIndex">
                  <el-select v-model="conditionItem.conditionType" placeholder="请选择类型" clearable size="small">
                    <el-option v-for="(conditionTypeItem, conditionTypeIndex) in conditionTypeList" :label="conditionTypeItem" :value="conditionTypeIndex" />
                  </el-select>
                </el-form-item> -->
                <!--脚本信息-->


                <el-row :gutter="10">
                  <el-col style="width: 49%;"  v-if="conditionItem.conditionType !== 2">
                    <div>条件脚本</div>
                    <el-form-item class="mybox_s1" label="" :prop="'runScript' + index + '' + conditionIndex">
                  <el-input v-model="conditionItem.conditionScript" :rows="3" type="textarea" placeholder="请输入内容"/>
                </el-form-item>
                  </el-col>

                  <el-col style="width: 2%;"   v-if="conditionItem.conditionType !== 2">
                    <i class="el-icon-d-arrow-right" style="margin: 60px auto 0 0px;"></i>
                  </el-col>


                  <el-col style="width: 49%;"  v-if="conditionItem.conditionType !== 2">
                    <div>执行脚本</div>
                    <el-form-item  class="mybox_s2"  label="" :prop="'executeScript' + index + '' + conditionIndex">
                  <el-input v-model="conditionItem.execute" :rows="3" type="textarea" placeholder="请输入内容"/>
                </el-form-item>
                  </el-col>


                  <el-col style="width: 100%;"  v-if="conditionItem.conditionType == 2">
                    <div>执行脚本</div>
                    <el-form-item  class="mybox_s2"  label="" :prop="'executeScript' + index + '' + conditionIndex">
                  <el-input v-model="conditionItem.execute" :rows="3" type="textarea" placeholder="请输入内容"/>
                </el-form-item>
                  </el-col>

                </el-row>

                <!-- <el-form-item v-if="conditionItem.conditionType !== 2" label="条件脚本" :prop="'runScript' + index + '' + conditionIndex">
                  <el-input v-model="conditionItem.conditionScript" :rows="1" type="textarea" placeholder="请输入内容"/>
                </el-form-item>

                <el-form-item  label="执行脚本" :prop="'executeScript' + index + '' + conditionIndex">
                  <el-input v-model="conditionItem.execute" :rows="3" type="textarea" placeholder="请输入内容"/>
                </el-form-item> -->


            </div>
            <div style="text-align: right; margin-right: 20px;"><el-button style="margin-bottom: 0px" type="primary" @click="addCondition(item.conditionList)">添加条件</el-button></div>


          </div>
          </div>

          </div>


        </div>

        <div style="text-align: right;margin-top: 20px;"><el-button type="primary" @click="addScript" style="margin-bottom: 20px">添加脚本</el-button></div>


        <el-form-item label="输出结果" prop="result">
          <el-input v-model="scriptForm.result" :rows="5" type="textarea"/>
        </el-form-item>
      </el-form>




      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="executeSubmitForm">确 定</el-button>
        <el-button @click="executeCancel">取 消</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
  import {listRule, getRule, delRule, addRule, updateRule} from "@/api/expert/rule";
  import {listScript, addAllScript, getScript, delScript, addScript, updateScript} from "@/api/expert/script";
  import {listParam} from "@/api/expert/param";
  import {execute} from "@/api/expert/circuit";

  export default {
    name: "Rule",
    data() {
      return {
        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 规则信息表格数据
        ruleList: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        // 是否显示弹出层
        openExecute: false,
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          sceneId: null,
          name: null,
          runEnv: null,
          runScript: null,
          state: null,
          insertTime: null,
          userId: null,
          priority: null
        },
        // 查询参数
        paramQueryParams: {
          pageNum: 1,
          pageSize: 99999,
          name: null,
          type: null,
          priority: null,
          sceneId: null,
        },
        // 表单参数
        form: {},
        // 表单校验
        rules: {},
        // 表单参数
        scriptForm: {
          sceneId: '',
          sceneName: '',
          ruleId: '',
          inputParameter: '',
          outputParameter: '',
          variable: '',
          scriptContent: '',
          scriptName: '',
          illustrate: '',
          scriptType: '',
        },
        // 表单校验
        scriptRules: {},

        // 单行数据
        selectRow: null,

        // scriptTypeList
        scriptTypeList: ["赋值", "范围", "条件", "公式", "自定义"],

        conditionTypeList:["如果", "否则如果", "否则"],

        scriptList: [],
      };
    },
    created() {
      this.getList();
    },
    methods: {

      /** 查询规则信息列表 */
      getList() {
        this.loading = true;
        listRule(this.queryParams).then(response => {
          this.ruleList = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },
      /** 查询输入、输出参数 */
      getParamListBySceneId(sceneId) {
        this.$set(this.form, 'inputParameter', '')
        this.$set(this.form, 'outputParameter', '')
        this.paramQueryParams.sceneId = sceneId
        listParam(this.paramQueryParams).then(response => {
          if (response.rows) {
            console.log(response.rows)
            let inputParameter = ""
            let outputParameter = ""

            for (let i = 0; i < response.rows.length; i++) {
              if (response.rows[i].dataType === 1) {
                inputParameter = inputParameter + response.rows[i].code + "、"
              } else if (response.rows[i].dataType === 2) {
                outputParameter = outputParameter + response.rows[i].code + "、"
              }

            }
            this.$set(this.form, 'inputParameter', inputParameter)
            this.$set(this.form, 'outputParameter', outputParameter)

          }
        });
      },
      /** 查询脚本列表 */
      getScriptList(ruleId){
        this.scriptList = []

        listScript({'ruleId': ruleId}).then(response => {
          let rows = response.rows;
          for (let i = 0; i < rows.length; i++) {
            let objJson = {}
            // 脚本类型
            if (rows[i].type === 2){
              let conditionList = JSON.parse(rows[i].content);
              objJson = {'scriptType':rows[i].type, 'runScript': "", 'conditionList':conditionList, 'priority':rows[i].priority, 'state': rows[i].state}

            }else {
              // 其他类型
              objJson = {'scriptType':rows[i].type, 'runScript': rows[i].content, 'conditionList':[], 'priority':rows[i].priority, 'state': rows[i].state}
            }
            this.scriptList.push(objJson)
          }

        });
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        this.form = {
          id: null,
          sceneId: null,
          name: null,
          runEnv: null,
          runScript: null,
          state: null,
          insertTime: null,
          userId: null,
          priority: null,
          illustrate: '',
          scriptType: '',
        };
        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.id)
        this.single = selection.length !== 1
        this.multiple = !selection.length
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.scriptList = []
        this.reset();
        this.open = true;
        this.title = "添加规则信息";
        // this.form.inputParameter = ''
        // this.form.outputParameter = ''

      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.reset();
        const id = row.id || this.ids
        getRule(id).then(response => {
          this.form = response.data;
          this.open = true;
          this.title = "修改规则信息";
          this.getParamListBySceneId(this.form.sceneId)
          this.getScriptList(id);
        });
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            if (this.form.id != null) {
              let data = this.packageScript(this.form.id);

              updateRule(this.form).then(response => {
                addAllScript(data, this.form.id).then(response => {
                  this.$modal.msgSuccess("修改成功");
                  this.open = false;
                  this.getList();
                });
              });


            } else {
              this.form.state = 0
              addRule(this.form).then(response => {
                this.$modal.msgSuccess("新增成功");
                this.open = false;
                this.getList();
              });
            }
          }
        });
      },
      /** 保存脚本 */
      packageScript(ruleId){
        let data = []
        for (let i = 0; i < this.scriptList.length; i++){
          let scriptData = {
            'ruleId': ruleId,
            'content': '',
            'type': 0,
            'state': 1,
            'priority': 0,
          }
          scriptData.type = this.scriptList[i].scriptType
          scriptData.state = this.scriptList[i].state
          if (this.scriptList[i].priority !== undefined && this.scriptList[i].priority != null){
            scriptData.priority = parseInt(this.scriptList[i].priority)
          }

          if (this.scriptList[i].scriptType === 2){
            // 脚本
            scriptData.content = JSON.stringify(this.scriptList[i].conditionList)
          }else {
            // 其他
            scriptData.content = this.scriptList[i].runScript
          }

          data.push(scriptData)

        }
        return data

      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const ids = row.id || this.ids;
        this.$modal.confirm('是否确认删除规则信息编号为"' + ids + '"的数据项？').then(function () {
          return delRule(ids);
        }).then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        }).catch(() => {
        });
      },
      /** 导出按钮操作 */
      handleExport() {
        this.download('edsta/rule/export', {
          ...this.queryParams
        }, `edsta_rule.xlsx`)
      },
      /** 执行脚本弹窗 */
      execute(row) {
        this.selectRow = row
        this.openExecute = true
        this.scriptForm = {
          sceneId: row.sceneId,
          ruleId: row.id,
          sceneName: '',
          inputParameter: '',
          outputParameter: '',
          variable: '',
          result: '',
          runScript: row.runScript,
          scriptType: row.scriptType,
          scriptName: row.name,
          illustrate: '输入参数和输出参数都可用在条件上;\n输入参数的值为输入变量,是定义的变量;\n输出参数的值为元器件库;',
        }
        let paramQueryParams = {
          pageNum: 1,
          pageSize: 99999,
          name: null,
          type: null,
          priority: null,
          sceneId: row.sceneId,
          inputMinValue: null,
          inputMaxValue: null
        }
        listParam(paramQueryParams).then(response => {
          this.$set(this.scriptForm, 'inputParameter', '')
          this.$set(this.scriptForm, 'outputParameter', '')
          if (response.rows) {
            let inputParameter = ''
            let outputParameter = ''
            console.log(response.rows)
            for (let i = 0; i < response.rows.length; i++) {
              if (response.rows[i].dataType === 1) {
                inputParameter = inputParameter + response.rows[i].code + "、"
              } else if (response.rows[i].dataType === 2) {
                outputParameter = outputParameter + response.rows[i].code + "、"
              }
            }
            this.$set(this.scriptForm, 'inputParameter', inputParameter)
            this.$set(this.scriptForm, 'outputParameter', outputParameter)

          }
        });

        this.getScriptList(row.id);

      },
      /** 执行脚本 */
      executeSubmitForm() {
        this.$refs["scriptForm"].validate(valid => {
          if (valid) {
            // 先保存脚本，再运行脚本
            let data = this.packageScript(this.selectRow.id);

            addAllScript(data, this.selectRow.id).then(response => {
              execute(this.scriptForm.sceneId, this.scriptForm.ruleId, this.scriptForm.variable).then(response => {
                console.log("-----------")
                console.log(response)
                this.scriptForm.result = response.data + '';
              }, error => {
                console.log("---------------------------")
                console.log(error)
                this.scriptForm.result = error + '';
              });
            });



          }
        });
      },
      /** 取消 */
      executeCancel() {
        this.openExecute = false
        this.scriptForm = {
          id: null,
          name: null,
          state: null,
          insertTime: null,
          userId: null,
          path: null,
          scriptType: null
        };
        this.resetForm("scriptForm");
      },
      /** 删除脚本 */
      deleteScript(index){
        if (this.scriptList.length > 1){
          this.scriptList.splice(index, 1)
        }
      },
      /** 添加脚本 */
      addScript(){
        let json = {'scriptType':0, 'runScript':"", 'conditionList':[], 'priority': this.scriptList.length + 1, 'state': 1}
        this.scriptList.push(json)
      },
      /** 脚本上移 */
      scriptUpward(index){
        // let priority = this.scriptList[index].priority
        let scriptType = this.scriptList[index].scriptType
        let runScript = this.scriptList[index].runScript
        let conditionList = this.scriptList[index].conditionList
        let state = this.scriptList[index].state

        // this.scriptList[index].priority = this.scriptList[index-1].priority
        this.scriptList[index].scriptType = this.scriptList[index-1].scriptType
        this.scriptList[index].runScript = this.scriptList[index-1].runScript
        this.scriptList[index].conditionList = this.scriptList[index-1].conditionList
        this.scriptList[index].state = this.scriptList[index-1].state

        // this.scriptList[index-1].priority = priority
        this.scriptList[index-1].scriptType = scriptType
        this.scriptList[index-1].runScript = runScript
        this.scriptList[index-1].conditionList = conditionList
        this.scriptList[index-1].state = state


      },
      /** 脚本下移 */
      scriptDownward(index){
        // let priority = this.scriptList[index].priority
        let scriptType = this.scriptList[index].scriptType
        let runScript = this.scriptList[index].runScript
        let conditionList = this.scriptList[index].conditionList
        let state = this.scriptList[index].state

        // this.scriptList[index].priority = this.scriptList[index-1].priority
        this.scriptList[index].scriptType = this.scriptList[index+1].scriptType
        this.scriptList[index].runScript = this.scriptList[index+1].runScript
        this.scriptList[index].conditionList = this.scriptList[index+1].conditionList
        this.scriptList[index].state = this.scriptList[index+1].state

        // this.scriptList[index-1].priority = priority
        this.scriptList[index+1].scriptType = scriptType
        this.scriptList[index+1].runScript = runScript
        this.scriptList[index+1].conditionList = conditionList
        this.scriptList[index+1].state = state


      },
      /** 删除条件 */
      deleteCondition(conditionList, index){
        if (conditionList.length > 1){
          conditionList.splice(index, 1)
        }
      },
      /** 添加条件 */
      addCondition(conditionList){
        let json = {'conditionType':0, 'conditionScript': '','priority':conditionList.length + 1, 'execute':''}
        conditionList.push(json)
      },
      /** 条件上移 */
      conditionUpward(index, conditionList){
        let conditionType = conditionList[index].conditionType
        let conditionScript = conditionList[index].conditionScript
        let execute = conditionList[index].execute

        conditionList[index].conditionType = conditionList[index-1].conditionType
        conditionList[index].conditionScript = conditionList[index-1].conditionScript
        conditionList[index].execute = conditionList[index-1].execute

        conditionList[index-1].conditionType = conditionType
        conditionList[index-1].conditionScript = conditionScript
        conditionList[index-1].execute = execute
      },
      /** 条件下移 */
      conditionDownward(index, conditionList){
        let conditionType = conditionList[index].conditionType
        let conditionScript = conditionList[index].conditionScript
        let execute = conditionList[index].execute

        conditionList[index].conditionType = conditionList[index+1].conditionType
        conditionList[index].conditionScript = conditionList[index+1].conditionScript
        conditionList[index].execute = conditionList[index+1].execute

        conditionList[index+1].conditionType = conditionType
        conditionList[index+1].conditionScript = conditionScript
        conditionList[index+1].execute = execute
      },


    }
  };
</script>
